<template>
  <diagnose-link>
    <view class="diagnose">
      <view class="title">
        “ AI快速诊断
      </view>
      <view class="content">
        开始实验时，屏幕中央会出现出一个词(启动词)，请你在看到这个启动词之后，立即按下键盘的“空格键”，开始计时。与此同时在看到启动词后，请你在第一时间将第一个出现在脑中的词汇(反应词)用语言回答出来。回答结束后再次按下键盘的“空格键”停止计时。随后屏幕中央会再出现启动词，请重复上述操作。如果你明白了上诉操作，就可以进行一个简短的练习。
      </view>
      <view class="beginBtn" @click="handleAnswer">
        开始测评
      </view>
    </view>
  </diagnose-link>
</template>

<script setup lang="ts">
import diagnoseLink from '@/components/links/fourth.vue'
import {useRouter} from "vue-router";
const router = useRouter()
const handleAnswer = ()=>{
  //#ifdef H5
  router.push('/pages/diagnose/diagnose')
  //#endif
  //#ifdef APP-PLUS
  uni.navigateTo({
    url:'/page/diagnose/diagnose'
  })
  //#endif
}
</script>


<style scoped lang="scss">
.diagnose{
  box-sizing: border-box;
  padding: 36rpx 60rpx 36rpx 282rpx;
  display: flex;
  flex-direction: column;
  align-items: end;
  .title{
    font-weight: 600;
    font-size: 23.4rpx;
    color: #00FFF2;
    letter-spacing: 0;
    text-align: right;
  }
  .content{
    margin-top: 20rpx;
    font-weight: 400;
    font-size: 8.58rpx;
    color: #00FFF2;
    letter-spacing: 0;
    line-height: 15.26rpx;
    text-indent: 2em;
  }
}
.beginBtn {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 24rpx;
  width: 125rpx;
  height: 37.11rpx;
  background-image: url('../../static/image/all_Btn.png');
  background-size: 100% 100%;
  margin-top: 15rpx;
  font-weight: 500;
  font-size: 10.92rpx;
  color: #FFFFFF;
  letter-spacing: 0;
  text-align: center;
  line-height: 37.11rpx;
}
</style>
